<!DOCTYPE html>
<html>
  <head>
    <title>Audio Loop Benchmark</title>
    <style>* { font-family: monospace; }</style>
  </head>
  <body>
    <h1>Audio Loop Benchmark</h1>
    <p>
      Benchmark measuring how fast we can continuously repeat a short sound
      clip. In the ideal scenario we'd have zero latency processing script,
      seeking back to the beginning of the clip, and resuming audio playback.
    </p>

    <button onclick="startTest();">Start</button>

    <p>
      Times Played: <span id="times"></span></span><br>
      Clip Duration: <span id="clip"></span></span><br>
      Ideal Duration: <span id="ideal"></span><br>
      Actual Duration: <span id="actual"></span><br>
      Average Latency: <span id="average"></span><br>
    </p>

    <script>
      var TIMES = 50, averageLatency = 0;

      function getAndClearElement(id) {
        var elem = document.getElementById(id);
        elem.innerText = '';
        return elem;
      }

      function startTest() {
        var timesElem = getAndClearElement('times');
        var clipElem = getAndClearElement('clip');
        var idealElem = getAndClearElement('ideal');
        var actualElem = getAndClearElement('actual');
        var averageElem = getAndClearElement('average');
        var buttonElem = document.querySelector('button');

        var loopCount = 0, idealDuration = 0, actualDuration = 0;
        var startTime;

        buttonElem.disabled = true;

        function onLoaded() {
          idealDuration = Math.round(audio.duration * TIMES * 1000, 0);
          idealElem.innerText =  idealDuration + ' ms';
          clipElem.innerText = Math.round(audio.duration * 1000, 0) + ' ms';
          audio.addEventListener('seeked', onLoop);
          startTime = window.performance.now();
          audio.play();
        }

        var audio = document.createElement('audio');
        audio.addEventListener('canplaythrough', onLoaded);
        audio.loop = true;
        audio.src = '../pink_noise_140ms.wav';

        function onLoop() {
          ++loopCount;
          timesElem.innerText = loopCount + '/' + TIMES;
          if (loopCount == TIMES) {
            actualDuration = window.performance.now() - startTime;
            actualElem.innerText = actualDuration + ' ms';
            buttonElem.disabled = false;

            averageLatency = (actualDuration - idealDuration) / loopCount;
            averageElem.innerText = averageLatency + ' ms';

            // Let the PyAuto test know we're done testing.
            if (window.domAutomationController)
              window.domAutomationController.send(true);

            audio.pause();
          }
        }
      }
    </script>
  </body>
</html>
